search-results: Fix flickering of the selection

When updating search results, the current result set is
recreated from scratch before setting the selection
highlight. This results in two style changes of the selected
item, and as a CSS transition is used to animate the style
change, the selected item flickers if it remains the same as
with the previous search term.
Fix by hiding the result set until the selection is set, to
avoid the transition in that case.

https://bugzilla.gnome.org/show_bug.cgi?id=646019

diff --git a/js/ui/searchDisplay.js b/js/ui/searchDisplay.js
index ffe9fa4824612d80be32706119b62fadd4602466..7b0a3d114186894f715ffcb6bb660bfa1eb302e3 100644 (file)
--- a/js/ui/searchDisplay.js
+++ b/js/ui/searchDisplay.js
@@ -333,6 +333,13 @@ SearchResults.prototype = {
         let terms = this._searchSystem.getTerms();
         this._openSearchSystem.setSearchTerms(terms);
 
+        // To avoid CSS transitions causing flickering
+        // of the selection when the first search result
+        // stays the same, we hide the content while
+        // filling in the results and setting the initial
+        // selection.
+        this._content.hide();
+
         for (let i = 0; i < results.length; i++) {
             let [provider, providerResults] = results[i];
             let meta = this._metaForProvider(provider);
@@ -343,6 +350,8 @@ SearchResults.prototype = {
         if (this._selectedOpenSearchButton == -1)
             this.selectDown(false);
 
+        this._content.show();
+
         return true;
     },